import { OptionComponent } from './../option/option.component';
import { Component, OnInit, Input, forwardRef, ViewChild, AfterViewInit, ViewChildren, ContentChild, ContentChildren, QueryList } from '@angular/core';
import { NG_VALUE_ACCESSOR } from '@angular/forms';
import { BehaviorSubject } from 'rxjs';
import { ClearableDirective } from 'src/app/directive/clearable.directive';

@Component({
  selector: 'min-select',
  templateUrl: './select.component.html',
  styleUrls: ['./select.component.less'],
  providers: [{
    provide: NG_VALUE_ACCESSOR,
    useExisting: forwardRef(() => SelectComponent),
    multi: true
  }],
  host: {
    '(document:click)': 'onClick($event)'
  },
})

export class SelectComponent implements OnInit {
  @ContentChild(ClearableDirective)
  private child: ClearableDirective;

  onModelChange: Function = () => { };
  onModelTouched: Function = () => { };
  public isOption: boolean = false;
  public seletedData: string;
  public seletedKey: any;
  public lableSwitch = new BehaviorSubject(null);
  public isClear: boolean = false;

  constructor() { }
  ngOnInit() {
   
  }
  test(data) {
    console.log(22);

  }
  onClick(event) {
    event.stopPropagation();
    this.isOption = false;
  }
  clearShow() {
    if (this.child) {
      this.isClear = true;
    }
  }
  clearHide() {
    if (this.child) {
      this.isClear = false;
    }
  }
  writeValue(currentValue: any) {
    // if(currentValue || currentValue === 0){
    this.seletedKey = currentValue;
    this.lableSwitch.next(this.seletedKey);
    // }

  }
  registerOnChange(fn: Function): void {
    this.onModelChange = fn;
  }

  registerOnTouched(fn: Function): void {
    this.onModelTouched = fn;
  }


}
